<template>
	<view class="container" :style="'height: '+screenHeight+'px!important;'">
		<view class="uni-nav">
			<image class="uni-nav-left-img" src="../../static/icon/back.png" @click="back()"></image>
			<label>备份助记词</label>
			<image class="uni-nav-right-img"></image>
		</view>
		<view class="success">
			<image src="../../static/icon/success.png" mode=""></image>
		</view>
		<view class="success_text">
			<text>地址助记词备份成功！</text>
		</view>
		<view class="copy">
			<text>点击复制</text>
		</view>
		<view class="mnemonic_bg">
			<text v-for="(item,index) in mnemonicList" :key="index">{{item}}</text>
		</view>
		<view class="mnemonic_correct">
			<text>您的助记词正确，为了保证您的钱包安全，建议您删掉助记词</text>
		</view>
		<view class="complete">
			<image src="../../static/icon/complete.png" mode=""></image>
		</view>
	</view>
</template>

<script>
	export default {
	data() {
		return {
			screenHeight: '',
			mnemonicList: []
		}
	},
		onLoad() {
			this.screenHeight = uni.getSystemInfoSync().windowHeight;
		},
		mounted() {
			this.mnemonicList = ['own ', 'wgzcb ', 'wun ', 'sdefg ', 'laisf ', 'sakd ', 'tjsfgs ', 'urhalhf ', 'app ', 'abuogf ', 'euer ',
				'wuekl'
			];
		},
		methods:{
			back(){
				uni.navigateBack({
					delta:1
				})
			}
		}
	}
</script>

<style scoped>
	.container {
		background-size: 100% 100%;
		background-image: url(../../static/icon/wallet_bg.png);
	}
	.success{
		display: flex;
		justify-content: center;
		margin-top: 74upx;
	}
	.success image{
		width: 79upx;
		height: 79upx;
	}
	.success_text{
		margin-top: 26upx;
		display: flex;
		justify-content: center;
	}
	.success_text text{
		font-size: 26upx;
		font-family:SimHei;
		font-weight:400;
		color:rgba(243,41,75,1);
		line-height:36px;
		background:linear-gradient(0deg,rgba(231,163,85,1) 0%, rgba(247,231,191,1) 100%);
		-webkit-background-clip: text; 
		-webkit-text-fill-color:transparent
	}
	.copy{
		margin-top: 36upx;
		margin-right: 35upx;
		text-align: right;
	}
	.copy text{
		font-size: 20upx;
		font-family:Adobe Heiti Std;
		font-weight:normal;
		color:rgba(101,101,101,1);
		line-height:32px;
		background:linear-gradient(0deg,rgba(247,205,59,1) 0%, rgba(255,255,245,1) 100%);
		-webkit-background-clip: text; /*必需加前缀 -webkit- 才支持这个text值 */
		-webkit-text-fill-color: transparent; /*text-fill-color会覆盖color所定义的字体颜色： */
	}
	.mnemonic_bg{
		margin-left: 36upx;
		margin-right: 36upx;
		margin-top: 24upx;
		border: 1px solid #FDF1CF;
		border-radius: 20upx;
		height: 135upx;
        padding-left: 24upx;
		padding-right: 24upx;
		padding-top: 20px;
	}
	.mnemonic_bg text{
		font-size: 28upx;
		font-family:SimHei;
		font-weight: 400;
		color: #FFFFFF;
	}
	.mnemonic_correct{
		margin-left: 62upx;
		margin-right: 62upx;
		margin-top: 35upx;
	}
	.mnemonic_correct text{
		font-family:Adobe Heiti Std;
		font-weight:normal;
		font-size: 26upx;
		color: #D9C5A1;
	}
	.complete{
		display: flex;
		justify-content: center;
		position: fixed;
		bottom: 93upx;
		margin: 0 auto;
		left: 0;
		right: 0;
	}
	.complete image{
		width: 298upx;
		height: 82upx;
	}
</style>
